.page{
	width: 100%;
	height: 100vh;
	// font-size: 1.2rem;
	background: #F3F3F3;
	overflow: hidden;
	// overflow-y: hidden;
	// overflow-x: auto;
	// box-sizing: border-box;
	flex-grow: 1;
	// overflow-y:auto; 
}
.content {
	width: 100%;
	margin: 1.5% 0 0 1%;
	height: 92%;
	display: flex;
	.left {
		width: 21%;
		height: 100%;
		margin-right: 1%;
		.l-header {
			min-height: 20%;
			font-size: 1rem;
			flex-flow: column;
			justify-content: space-around;
			display: flex;
			background: #FFFFFF;
			box-sizing: border-box;
			// border-width: 0px 4px 0px 0px;
			// border-style: solid;
			// border-color: #3E8FF7;
			box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.3);
			position: relative;
			.info {
				margin-left: 3%;
				margin-bottom: 1%;
				width: 94%;
				text {
					color: #585858;
				}
				.title-icon {
					background-color: #3E8FF7;
					width: 9.381rpx;
					height: 37.523rpx;
					margin-top: 13.133rpx;
					margin-right: 9.381rpx;
				}
			}
			.extra-info {
				margin-top: 2%;
				margin-bottom: 2%;
			}
			.changeStyle {
				display: flex;
				align-items: center;
				justify-content: center;
				color: #FFFFFF;
				width: 100%;
				height: 75.047rpx; 
				border-radius: 4% 0 0 4%;
				background: #3E8FF7
			}
			// .changeStyle {
			// 	display: flex;
			// 	align-items: center;
			// 	justify-content: center;
			// 	color: #FFFFFF;
			// 	position: absolute;
			// 	right: 0;
			// 	width: 32%;
			// 	height: 30%;
			// 	border-radius: 4% 0 0 4%;
			// 	background: #3E8FF7
			// }
		}
		.l-listInfo {
			height: 100%;
			.item {
				flex-flow: column;
				justify-content: space-around;
				display: flex;
				height: 12%;
				border-radius: 4px;
				margin: 2% 0;
				font-size: 1rem;
				color: #585858;
				background-color: #FFFFFF;
				.item-info {
					margin: 2% 0 2% 3% ;
					text {
						color: #333333;
					}
				}
			}
			.active {
				flex-flow: column;
				justify-content: space-around;
				display: flex;
				height: 12%;
				border-radius: 4px;
				margin: 2% 0;
				font-size: 1rem;
				color: #FFFFFF;
				background-color: #3E8FF7;
				.item-info {
					margin: 2% 0 2% 3% ;
					text {
						color: #FFFFFF;
					}
				}
			}
		}
	}
	.right {
		width: 80%;
		height: 100%;
		margin-right: 2%;
		.r-header {
			width: 100%;
			height: 20%;
			display: flex;
			.h-left {
				height: 100%;
				width: 50%;
				margin-right: 0.5%;
				display: flex;
				justify-content: space-between;
				align-items: center;
				background-color: #FCFCFC;
				.yield {
					height: 100%;
					display: flex;
					flex-flow: column;
					justify-content: space-around;
					margin-left: 4%;
					color: #333333;
					font-size: 1.2rem;
					font-weight: 700;
					text {
						color: #585858;
						font-weight: 500;
					}
				}
				.chart{
					width: 40%;
					height: 100%;
				}
			}
			.h-right {
				height: 100%;
				width: 50%;
				margin-left: 0.5%;
				background-color: #FCFCFC;
				.flex-margin {
					height: 100%;
					display: flex;
					flex-flow: column;
					justify-content: space-around;
					margin: 0 4%;
				}
			}
		}
		.r-middle {
			width: 100%;
			// min-height: 20%;
			height: 20%;
			margin: 1% 0;
			display: flex;
			align-items: center;
			background-color: #46C253;
			.flex-left-margin {
				width: 49.5%;
				height: 100%;
				display: flex;
				align-items: center;
				// margin: 0 4%;
				.qualified {
					width: 20%;
					font-size: 2rem;
					color: #FFFFFF;
					margin-left: 4%;
				}
				.number {
					width: 70%;
					height: 100%;
					background-color: #46C253;
					.u-number-box {
						width: 100%;
						height: 100%;
					}
					.minus {
						width: 123.827rpx;
						height: 123.827rpx;
						border-radius: 4px;
						opacity: 1;
						box-sizing: border-box;
						border: 4px solid #FFFFFF;
						font-size: 1rem;
						font-weight: bold;
						color: #fff;
					}
					.plus {
						width: 123.827rpx;
						height: 123.827rpx;
						border-radius: 4px;
						padding-bottom: 7.505rpx;
						opacity: 1;
						box-sizing: border-box;
						border: 4px solid #FFFFFF;
						font-size: 3rem;
						font-weight: 100;
						color: #fff;
					}
					.input {
						width: 100%;
						height: 50%;
						margin: 0 4%;
						font-size: 1.5rem;
						background-color: #FFFFFF;
					}
				}
			}
			.flex-right {
				width: 50%;
				height: 100%;
				margin-left: 2%;
				display: flex;
				justify-content: space-around;
				align-items: center;
				flex-wrap: wrap;
				overflow: hidden;
				.item {
					width: 20%;
					height: 70%;
					border-radius: 7.505rpx;
					// margin: 2% 4%;
					font-size: 2rem;
					color: #585858;
					background-color: #FFFFFF;
					display: flex;
					align-items: center;
					justify-content: center;
				}
			}
		}
		.r-bottom {
			width: 100%;
			height: 60%;
			display: flex;
			.b-left{
				width: 50%;
				height: 100%;
				margin-right: 0.5%;
				.rework {
					width: 100%;
					min-height: 15%;
					margin-bottom: 2%;
					display: flex;
					align-items: center;
					background-color: #FFA631;
					.rework-title {
						width: 20%;
						font-size: 2rem;
						color: #FFFFFF;
						margin-left: 4%;
					}
					.number {
						width: 70%;
						height: 100%;
						background-color: #FFA631;
						.u-number-box {
							width: 100%;
							height: 100%;
						}
						.minus {
							width: 93.809rpx;
							height: 93.809rpx;
							border-radius: 4px;
							opacity: 1;
							box-sizing: border-box;
							border: 4px solid #FFFFFF;
							font-size: 1rem;
							font-weight: bold;
							color: #fff;
						}
						.plus {
							width: 93.809rpx;
							height: 93.809rpx;
							border-radius: 4px;
							padding-bottom: 7.505rpx;
							opacity: 1;
							box-sizing: border-box;
							border: 4px solid #FFFFFF;
							font-size: 3rem;
							font-weight: 100;
							color: #fff;
						}
						.input {
							width: 100%;
							height: 80%;
							margin: 0 4%;
							font-size: 1.5rem;
							background-color: #FFFFFF;
							/deep/ .u-input__content__field-wrapper__field {
								height: 100%;
								font-size: 1.5rem!important;
							}
						}
					}
				}
				// .falw {
				// 	width: 100%;
				// 	height: 80%;
				// 	background-color: #FFFFFF;
				// 	.title {
				// 		margin-left: 2%;
				// 		font-size: 1.5rem;
				// 		color: #333;
				// 	}
				// 	.falw-list {
				// 		margin: 2%;
				// 		height: 100%;
				// 		width: 100%;
				// 		.item {
				// 			width: 100%;
				// 			display: flex;
				// 			justify-content: space-between;
				// 			margin: 2% 0;
				// 			.number {
				// 				width: 40%;
				// 				height: 100%;
				// 				margin-right: 5%;
				// 				background-color: #FFFFFF;
				// 				.u-number-box {
				// 					width: 100%;
				// 					height: 100%;
				// 				}
				// 				.minus {
				// 					width: 75.047rpx;
				// 					height: 75.047rpx;
				// 					border-radius: 4px;
				// 					opacity: 1;
				// 					box-sizing: border-box;
				// 					border: 2px solid #3E8FF7;
				// 					font-size: 1rem;
				// 					font-weight: bold;
				// 					color: #3E8FF7;
				// 				}
				// 				.plus {
				// 					width: 75.047rpx;
				// 					height:75.047rpx;
				// 					padding-bottom: 9.381rpx;
				// 					border-radius: 4px;
				// 					opacity: 1;
				// 					box-sizing: border-box;
				// 					border: 2px solid #3E8FF7;
				// 					font-size: 2.5rem;
				// 					font-weight: 100;
				// 					color: #3E8FF7;
				// 				}
				// 				.input {
				// 					width: 100%;
				// 					height: 50%;
				// 					border-radius: 7.505rpx;
				// 					border: 1px solid #DDDDDD;
				// 					margin: 0 4%;
				// 					font-size: 1.5rem;
				// 					background-color: #FFFFFF;
				// 					/deep/ .u-input__content__field-wrapper__field {
				// 						height: 100%;
				// 						font-size: 1.2rem!important;
				// 						text-align: center;
				// 					}
				// 				}
				// 			}
				// 		}
				// 	}
				// }
				
				.falw {
					width: 100%;
					height: 80%;
					background-color: #FFFFFF;
					.title {
						display: flex;
						justify-content: space-between;
						margin-left: 2%;
						margin-top: 1%;
						font-size: 1.5rem;
						color: #333;
					}
					.plus {
						width: 93.809rpx;
						height:93.809rpx;
						padding-bottom: 7.505rpx;
						margin-right: 2%;
						margin-top: 1%;
						border-radius: 4px;
						opacity: 1;
						box-sizing: border-box;
						border: 2px solid #3E8FF7;
						font-size: 2.5rem;
						font-weight: 100;
						color: #3E8FF7;
					}
					.defect-list{
						display: flex;
						flex-wrap: wrap;
						align-items: flex-start;
						.detail-content {
							width: 45%;
							margin: 2% 2%;
							.detail-item {
								padding-left: 2%;
								border-radius: 4px;
								display: flex;
								align-items: center;
								min-height: 93.809rpx;
								color: #585858;
								background-color: #E1F2FF;
							}
						}
					}
					}
			}
			.b-right {
				width: 50%;
				height: 100%;
				margin-left: 0.5%;
				.scrap {
					width: 100%;
					min-height: 15%;
					margin-bottom: 2%;
					display: flex;
					align-items: center;
					background-color: #FB602D;
					.scrap-title {
						width: 20%;
						font-size: 2rem;
						color: #FFFFFF;
						margin-left: 4%;
					}
					.number {
						width: 70%;
						height: 100%;
						background-color: #FB602D;
						.u-number-box {
							width: 100%;
							height: 100%;
						}
						.minus {
							width: 93.809rpx;
							height: 93.809rpx;
							border-radius: 4px;
							opacity: 1;
							box-sizing: border-box;
							border: 4px solid #FFFFFF;
							font-size: 1rem;
							font-weight: bold;
							color: #fff;
						}
						.plus {
							width: 93.809rpx;
							height: 93.809rpx;
							padding-bottom: 7.505rpx;
							border-radius: 4px;
							opacity: 1;
							box-sizing: border-box;
							border: 4px solid #FFFFFF;
							font-size: 3rem;
							font-weight: 100;
							color: #fff;
						}
						.input {
							width: 100%;
							height: 80%;
							margin: 0 4%;
							font-size: 2rem;
							background-color: #FFFFFF;
							/deep/ .u-input__content__field-wrapper__field {
								height: 100%;
								font-size: 1.5rem!important;
							}
						}
					}
				}
				// 旧样式
				// .problem {
					// width: 100%;
					// height: 80%;
					// background-color: #FFFFFF;
					// .title {
					// 	margin-left: 2%;
					// 	font-size: 1.5rem;
					// 	color: #333;
					// }
					// .falw-list {
					// 	margin: 2%;
					// 	height: 100%;
					// 	width: 100%;
					// 	.item {
					// 		width: 100%;
					// 		display: flex;
					// 		justify-content: space-between;
					// 		margin: 2% 0;
					// 		.number {
					// 			width: 40%;
					// 			height: 100%;
					// 			margin-right: 5%;
					// 			background-color: #FFFFFF;
					// 			.u-number-box {
					// 				width: 100%;
					// 				height: 100%;
					// 			}
					// 			.minus {
					// 				width: 75.047rpx;
					// 				height: 75.047rpx;
					// 				border-radius: 4px;
					// 				opacity: 1;
					// 				box-sizing: border-box;
					// 				border: 2px solid #3E8FF7;
					// 				font-size: 1rem;
					// 				font-weight: bold;
					// 				color: #3E8FF7;
					// 			}
					// 			.plus {
					// 				width: 75.047rpx;
					// 				height:75.047rpx;
					// 				border-radius: 4px;
					// 				opacity: 1;
					// 				box-sizing: border-box;
					// 				border: 2px solid #3E8FF7;
					// 				font-size: 2.5rem;
					// 				font-weight: 100;
					// 				color: #3E8FF7;
					// 			}
					// 			.input {
					// 				width: 100%;
					// 				height: 50%;
					// 				border-radius: 7.505rpx;
					// 				border: 1px solid #DDDDDD;
					// 				margin: 0 4%;
					// 				font-size: 1.5rem;
					// 				background-color: #FFFFFF;
					// 				/deep/ .u-input__content__field-wrapper__field {
					// 					height: 100%;
					// 					font-size: 1rem!important;
					// 					text-align: center;
					// 				}
					// 			}
					// 		}
					// 	}
					// }
				// }
				.problem {
					width: 100%;
					height: 80%;
					background-color: #FFFFFF;
					.title {
						display: flex;
						justify-content: space-between;
						margin-left: 2%;
						margin-top: 1%;
						font-size: 1.5rem;
						color: #333;
					}
					.plus {
						width: 93.809rpx;
						height:93.809rpx;
						padding-bottom: 7.505rpx;
						margin-right: 2%;
						margin-top: 1%;
						border-radius: 4px;
						opacity: 1;
						box-sizing: border-box;
						border: 2px solid #3E8FF7;
						font-size: 2.5rem;
						font-weight: 100;
						color: #3E8FF7;
					}
					.detail-content {
						// width: 100%;
						margin: 2% 2%;
						.detail-item {
							padding-left: 2%;
							border-radius: 4px;
							display: flex;
							align-items: center;
							min-height: 93.809rpx;
							color: #585858;
							background-color: #E1F2FF;
						}
					}
					}
			}
		}
	}
}
/deep/ .u-input__content__field-wrapper__field {
	height: 100%;
	font-size: 2rem!important;
}
.scroll-Y {
	height: 50%;
	padding-bottom: 5%;
	background-color: #FFFFFF;
}
.scroll-list{
	height: 70%;
	padding-bottom: 40%;
	background: #F5F6F8;
}
.fixed-button {
	width: 100%;
	height: 10%;
	position: absolute;
	bottom: 0;
	display: flex;
	align-items: center;
	background: #FFFFFF;
	box-shadow: 0px -4px 12px 0px rgba(0, 0, 0, 0.3);
	.back {
		width: 30%;
		height: 90%;
		border-radius: 7.505rpx;
		box-sizing: border-box;
		/* 中性色/输入框边框DD */
	}
	.submit {
		width: 70%;
		height: 90%;
		border-radius: 7.505rpx;
		box-sizing: border-box;
	}
	button {
		height: 100%;
		width: 100%;
		font-size: 1.5rem;
		font-weight: bold;
	}
}